<!DOCTYPE html>
<html dir="ltr" lang="en-US">
   <head>
      <meta charset="UTF-8" />
      <title>A date range picker for Twitter Bootstrap</title>
      <link rel="stylesheet" type="text/css" media="all" href="../bootstrap/css/bootstrap.min.css" />
      <link rel="stylesheet" type="text/css" media="all" href="daterangepicker.css" />
      <script type="text/javascript" src="../../jquery/jquery.js?v=1.7.2"></script>
      <script type="text/javascript" src="date.js"></script>
      <script type="text/javascript" src="daterangepicker.js"></script>
   </head>
   <body>



<input type="text" readonly="readonly" name="time1" id="time1" value="" />

<input type="text" class="w_h w_h_d" readonly="readonly" name="time2" id="first_state_time" value="" />

<input type="text" class="w_h w_h_d" readonly="readonly" name="time2" id="first_end_time" value="" />

<script type="text/javascript">
$(document).ready(function() {
  $('input[name=time1]').daterangepicker(
	 {
		ranges: {
		   '今天': ['today', 'today'],
		   '昨天': ['yesterday', 'yesterday'],
		   '最近七天': [Date.today().add({ days: -6 }), 'today'],
		   '最近30天': [Date.today().add({ days: -29 }), 'today'],
		   '本月': [Date.today().moveToFirstDayOfMonth(), Date.today().moveToLastDayOfMonth()],
		   '上个月': [Date.today().moveToFirstDayOfMonth().add({ months: -1 }), Date.today().moveToFirstDayOfMonth().add({ days: -1 })]
		},
		opens: 'right',
		format: 'yyyy-MM-dd',
		showDropdowns: true,
		separator: ' 至 ',
		startDate: Date.today().add({ days: -29 }),
		endDate: Date.today(),
		minDate: '2012-01-01',
		maxDate: '2013-12-31',
		locale: {
			applyLabel: '确定',
			clearLabel: '取消',
			fromLabel: '从',
			toLabel: '至',
			customRangeLabel: '自定义范围',
			daysOfWeek: ['一', '二', '三', '四', '五','六','日'],
			monthNames: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
			firstDay: 0
		},
		showWeekNumbers: false
		//buttonClasses: ['btn-danger3']
	 }, 
	 function(start, end) {
		//$('#reportrange span').html(start + ' - ' + end);

		//alert( (end-start)/(1000*60*60*24) );

		$('#first_state_time').val( start.toString('yyyy-MM-dd') );
		$('#first_end_time').val( end.toString('yyyy-MM-dd') );

		$(this).val('');


	 }
  );

  //Set the initial state of the picker label
  //$('#reportrange span').html(Date.today().add({ days: -29 }).toString('yyyy-MM-dd') + ' - ' + Date.today().toString('yyyy-MM-dd'));

});
</script>


   </body>
</html>
